youtube
This video covers how to load external assets like images, JSON files, and data from APIs into your p5.js 2.0 sketches. Learn the fundamentals of asynchronous operations in p5.js using Promises with async/await. Code:
🚀 Watch this video ad-free on Nebula
p5.js Web Editor Sketches:
🕹️ Loading a Single Image:
🕹️ Sequential Loading:
🕹️ API and Loading Animation:
🕹️ Parallel Loading with Promise.all:
🕹️ Loading images with placeholders exercise:
🎥 Previous:
🎥 Next:
References:
📖 p5.js 2.0 Beta:
📖 Promise.all:
🎨 Dog API:
Videos:
🚂
🚂
🚂
Timestamps:
0:00:00 Hello!
0:00:54 How to Load an Image in p5.js
0:02:16 Asynchronous Code: promises, async, and await
0:04:10 Common Mistakes to Avoid
0:05:51 Loading Data from a Live API
0:08:21 Loading Multiple Items in a Sequence
0:09:12 Creating a Custom Loading Animation
0:13:39 Faster Parallel Loading with Promise.all()
0:16:48 Challenge for you!
Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound
🚂 Website:
👾 Share Your Creation!
🚩 Suggest Topics:
💡 GitHub:
💬 Discord:
💖 Membership:
🛒 Store:
🖋️ Twitter:
📸 Instagram:
🎥
🎥
🔗 p5.js:
🔗 p5.js Web Editor:
🔗 Processing:
📄 Code of Conduct:
This description was auto-generated. If you see a problem, please open an issue:
#asyncawait #promises #p5js2 #loadingimages #api #json #promiseall #p5js #javascript
=====================================================
|
2025/10/03
youtube
